<template>
  <div class="main">
    <el-row :gutter="20" class="hidemenu">
        <el-col :span="3" class="hidetext">
            隐藏菜单
        </el-col>
    </el-row>
    <!-- 出证 -->
    <el-row :gutter="20">
        <el-col :span="4" class="chutext">
            存证服务
        </el-col>   
    </el-row>
    <!-- 时间 -->
    <el-row :gutter="20" id="time01">
        <el-col :span="7">
            <div class="grid-content bg-purple">
                <div class="block">
                    <el-date-picker
                    v-model="value1"
                    type="date"
                    placeholder="选择日期">
                    </el-date-picker>
                    <span class="demonstration">全部</span>
                </div>
            </div>
        </el-col>
        <el-col :span="17">
            <div class="grid-content bg-purple">
                <el-input
                    :style="{width: '250px'}"
                    placeholder="请输入内容"
                    prefix-icon="el-icon-search"
                    v-model="input2">
                </el-input>
                <el-button type="primary" icon="el-icon-search" size="medium">搜索</el-button>
                <el-button size="medium">添加存证</el-button>
            </div>
        </el-col>
    </el-row>

    <!-- 主体 -->
    <el-row :gutter="20">
        <div class="body2">
            <div class="formmain">
                            <!-- 收集存证名称 -->
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="存证名称" prop="name">
                    <el-input v-model="updata.existname"></el-input>
                </el-form-item>
            </el-form>
            <!-- 收集文件流 -->
           <el-upload
            class="upload-demo"
                ref="upload"
                :data="updata"
                action="http://hatelys.vipgz1.91tunnel.com/evidence/getfileload"
                :auto-upload="false">
                <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">点击存证</el-button>
                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>
            </div>
        </div>    
    </el-row>

  </div>
</template>

<script>
export default {
    name:'exsiting',
    data(){
        return{
            updata:{ 
                file:null,
                existname : ''
            },
        }
    },
    methods:{
        handleUpload(file) {
            this.updata.file = file.raw          
        },
        submitUpload(){
            this.$refs.upload.submit();
        }
    }
}
</script>

<style>
.block{
    padding-left: 20px;
}
.body2 {
		    /* width: 1125px; */
		    height: 1000px;
		    opacity: 1;
		    background: rgba(255, 255, 255, 1);
            margin: 20px 20px 10px 0px;
            padding-top:50px ;
}

.hidemenu{
    width: 100%;
    height: 50px;
}

.hidetext{
    font-size: 14px;
    font-weight: 400;
    color: rgba(116, 121, 140, 1);
    vertical-align: top;
}

.chutext{
    font-size: 18px;
    font-weight: 300;
    color: rgba(40, 45, 48, 1);
    vertical-align: top;
}

#time01{
    width: 100%;
    height: 80px;
    line-height: 80px;
    margin: 20px 10px 10px 0px;
    background-color:white ;
}

.tablemain01{
    margin-top: 30px;
    width: 100%;
}
.paging{
    width: 300px;
    height: 20px;
    /* background-color: antiquewhite; */
    margin: 20px auto;
}

.formmain{
    width: 400px;
    margin:  auto;
}
</style>